<template>
    <div class="app-container">
        <el-form :model="queryParams" size="small" :inline="true" v-show="showSearch" label-width="100px">
            <el-form-item label="项目编码" prop="planCode">
                <el-input v-model="queryParams.iNumber" placeholder="请输入框架计划编码" @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item label="项目名称" prop="planName">
                <el-input v-model="queryParams.iName" placeholder="请输入计划名称" @keyup.enter.native="handleQuery" />
            </el-form-item>
            <el-form-item>
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            </el-form-item>
        </el-form>

        <el-table :data="tableData" stripe style="width: 100%" v-loading="tableDataLoading">
            <el-table-column type="index" label="序号" align="center">
            </el-table-column>
            <el-table-column prop="iNumber" label="项目编号" align="center">
            </el-table-column>
            <el-table-column prop="iName" label="项目名称" align="center">
            </el-table-column>
            <el-table-column prop="iWay" label="招标方式" align="center">
                <template slot-scope="scope">
                    <el-tag :type="scope.row.iWay === 1 ? '' : 'success'">
                        {{ scope.row.iWay === 1 ? '公开' : '邀请' }}
                    </el-tag>
                </template>
            </el-table-column>
            <el-table-column prop="pLeader" label="项目负责人" align="center">
            </el-table-column>
            <el-table-column prop="projectState" label="项目状态" align="center">
                <template slot-scope="scope">
                    <el-tag type="" :color="getTagColor(scope.row.projectState)"
                        v-if="scope.row.projectState != 7 && scope.row.projectState != 8">
                        {{ getProjectStateText(scope.row.projectState) }}
                    </el-tag>
                    <el-tag type="danger" v-if="scope.row.projectState == 7">
                        {{ getProjectStateText(scope.row.projectState) }}
                    </el-tag>
                    <el-tag type="success" v-if="scope.row.projectState == 8">
                        {{ getProjectStateText(scope.row.projectState) }}
                    </el-tag>
                </template>
            </el-table-column>
            <el-table-column label="操作" align="center">
                <template slot-scope="scope">
                    <el-button @click="editRow(scope.row)" v-if="scope.row.projectState == 1" type="text" size="small">
                        编辑
                    </el-button>
                    <el-button @click="deleteRow(scope.row)" v-if="scope.row.projectState == 1" type="text"
                        size="small">
                        移除
                    </el-button>
                    <el-button @click="checkRow(scope.row)" v-if="scope.row.projectState == 1" type="text" size="small">
                        查看
                    </el-button>
                    <el-button @click="enterRow(scope.row)" v-if="scope.row.projectState > 1" type="text" size="small">
                        进入项目
                    </el-button>
                </template>
            </el-table-column>
        </el-table>

        <pagination v-show="total > 0" :total="total" :auto-scroll="false" :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize" @pagination="tenderProjectList" />

    </div>
    <!-- 表格展示 -->

</template>

<script>
import { getTenderProjectList, deleteTenderProject } from '@/api/system/purchase'
import { getUserProfile } from "@/api/system/user";

export default {
    data() {
        return {
            tableDataLoading: true,
            tableData: [],//项目列表table
            showSearch: true, //展示搜索条件
            total: 0,
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                // 搜索条件
                iName: '',
                iNumber: '',
            },
        }
    },
    methods: {
        //条件查询
        handleQuery() {
            this.tenderProjectList();
        },
        //重置查询条件
        resetQuery() {

        },
        //编辑当前行(只有立项中可以编辑)
        editRow(row) {
            this.$router.push({ path: '/tender/edit', query: { "iNumber": row.iNumber, "edit": 1 } })
        },
        //删除当前行(只有立项中可以删除)
        deleteRow(row) {
            this.$confirm('此操作将永久删除该项目, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                deleteTenderProject(row.iNumber).then(res => {
                    if (res.data == 1) {
                        this.$message({
                            type: 'success',
                            message: '删除成功!'
                        });
                        this.tableData = this.tableData.filter(item => item.iNumber != row.iNumber);
                    }
                })
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });
            });
        },
        //查看当前行
        checkRow(row) {
            this.$router.push({
                path: '/tender/checkProject',
                query: {
                    iNumber: row.iNumber, // 使用固定值测试
                    check: 1
                }
            });
        },
        //进入当前行详细页面(进入招标项目)
        enterRow(row) {
            this.$router.push({ path: '/tender/enterProject', query: { "iNumber": row.iNumber, "ent": 1, "status": row.projectState } })
        },
        //状态文字
        getProjectStateText(projectState) {
            switch (projectState) {
                case 1:
                    return '立项中';
                case 2:
                    return '招标中';
                case 3:
                    return '投标中';
                case 4:
                    return '开标中';
                case 5:
                    return '评标中';
                case 6:
                    return '定标中';
                case 7:
                    return '废标';
                case 8:
                    return '完成';
                default:
                    return '未知';
            }
        },

        getTagColor(projectState) {
            const colors = {
                1: '#e0f2ff', // 非常浅的浅蓝色
                2: '#cce6ff', // 浅蓝色
                3: '#b3d9ff', // 稍深的浅蓝色
                4: '#99ccff', // 中浅蓝色
                5: '#a6e6ff', // 另一种浅蓝色
                6: '#f2e6ff', // 浅紫罗兰色
                7: '#FF6F69'  // 浅青色
            };
            return colors[projectState] || '#f0f0f0'; // 默认浅色
        },
        //获得招标项目
        tenderProjectList() {
            getTenderProjectList(this.queryParams).then(res => {
                this.tableDataLoading = false;
                if (res.rows.length > 0) {
                    this.tableData = res.rows;
                    this.total = res.total;
                }
            })
        }
    },
    mounted() {
        this.tenderProjectList();
        console.log(this.$store, "时代风范收到");
    },
}
</script>
